<template>
  <div class="page-container">
    <page-filter-component :onFilterFormSubmit="fetchTableData"></page-filter-component>

    <el-card class="table-card">
      <div class="table-container">
        <el-table size="mini" stripe :data="tableData.list" class="el-table--scrollable-y">
          <el-table-column label="客户ID" prop="client_id"></el-table-column>
          <el-table-column label="客户名" prop="client_name"></el-table-column>
          <el-table-column label="待审核材料数量" prop="material_audit_count"></el-table-column>
          <el-table-column label="是否审核用户信息">
            <template slot-scope="{row}">
              <span>{{ row.user_approved ? '是' : '否' }}</span>
            </template>
          </el-table-column>
          <el-table-column label="状态" prop="client_status" :formatter="matchTableFieldLabelStatus"></el-table-column>
          <el-table-column label="备注" prop="note"></el-table-column>
          <el-table-column label="操作">
            <template slot-scope="{ row }">
              <el-button type="text" size="mini" icon="el-icon-view" @click="showApprovalData(row)" v-if="isAuditor()">
                去审批
              </el-button>
              <el-button type="text" size="mini" @click="onConfirmRejectData(row)" v-if="row.is_confirm == 1">
                已知晓
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>

      <div class="table-pagination">
        <el-pagination layout="total, sizes, prev, pager, next, jumper" :current-page="tableData.page"
          :page-size="tableData.pageSize" :total="tableData.total" @current-change="onPageChanged"
          @size-change="onPageSizeChanged"></el-pagination>
      </div>
    </el-card>

    <workflow-approval-dialog :visible.sync="approvalDialog" :approval-data="approvalData" :approval-item="selection"
      @approval-success="onApprovalSuccess()" />
  </div>
</template>
<script>
import index from './index.js';

export default index;
</script>

<style scoped lang="less">
@import './index.less';
</style>
